@import "mixin-fun";
@import "common/common";
body,html{
    margin: 0;
    padding: 0;
    height: 100%;
    background-color: #57afa9;
}
.app{
    height: 100%;
    background: url(../img/bg_c.png);
    background-size: contain;
    position: relative;
    background-repeat: repeat-x;
    background-position: center top;
    overflow: scroll;
    padding-bottom: rem(20);
    & img{
        max-width:100%;
        max-height: 100%;
        display: block;
        margin: 0 auto;
    }
    .content{
        padding: rem(30);
        .picker_message{
            padding: rem(30);
            background-color: #fbfdfd;
            .message_top{
                overflow: hidden;
                .s_img{
                    height: rem(200);
                }
                .img{
                    width: 35%;
                    height: rem(150);
                    line-height: rem(150);
                    float: left;
                    & img{
                        display:inline-block;
                        vertical-align: middle;
                    }
                }
                .text{
                    float: left;
                    margin-top: rem(60);
                    margin-left: rem(30);
                    .text_name{
                        font-size: rem(30);
                        font-weight: 500;
                        color: #231815;
                    }
                    .text_data{
                        font-size: rem(20);
                        color: #898989;
                    }
                }
            }
            .message_bottom{
                .bg{
                    position: relative;
                    margin-top: rem(20);
                    height: rem(60);
                    line-height: rem(60);
                    padding-left: rem(110);
                    padding-right: rem(100);
                    background-color: #efefef;
                    border-radius: 10px;
                    & input{
                        height: rem(60);
                        border: none;
                        background-color: #efefef;
                    }
                    .left{
                        position: absolute;
                        width: rem(110);
                        left: rem(15);
                    }
                    .right{
                        position: absolute;
                        width: rem(90);
                        height: rem(40);
                        line-height: rem(40);
                        text-align: center;
                        right: rem(15);
                        top: rem(10);
                        border: 1px solid #de6221;
                        color: #de6221;
                        border-radius: 10px;
                        padding: 0;
                    }
                }
            }
            .tishi{
                margin-top: rem(10);
                text-align: center;
            }
        }
        .my_message{
            padding: rem(30);
            background-color: #fbfdfd;
            max-height: rem(700);
            overflow: auto;
            margin-top: rem(20);
            line-height: rem(30);
            .title{
                background-color: #3f3a3a;
                color: #fff;
                min-width: 10px;
            }
            & p{
                margin-bottom: rem(5);
                font-size: rem(22);
                color: #221815;
            }
            .hint{
                font-size: rem(18);
                margin-top: rem(15);
            }
        }
        .btn{
            width: 48%;
            height: rem(50);
            margin: 0 auto;
            border-radius: 5px;
            text-align: center;
            color: #fff;
            background-color: #009944;
            line-height: rem(50);
            margin-top: rem(50);
            font-size: rem(32);
            font-weight: 700;
        }
        
    }
    .foot{
        width: 100%;
        // position: absolute;
        padding: rem(0) rem(30) rem(0) rem(30);
        overflow: hidden;
        & li{
            float: left;
            width: 25%;
            .title{
                height: rem(80);
            }
            & img{
                max-width: 100%;
                max-height: 100%;
            }
            .share1,.ipeen{
                padding-top:rem(12); 
            }
            .text{
                color: #fff;
                text-align: center;
                line-height: rem(25);
                margin-top: rem(15);
            }
        }
        // .text{
        //     width: 85%;
        //     margin: 0 auto;
        //     text-align: center;
        //     height: rem(45);
        //     line-height: rem(45);
        //     color: #fff;
        //     background-color: #e27832;
        //     border-radius: 5px;
        //     margin-top: rem(40);
        // }
    }
    .footer{
        width: 100%;
        position: absolute;
        bottom: 0;
        height: rem(120);
        background-color: #fff;
        .left_logo{
            width: rem(270);
            margin: 0 auto;
            margin-top: rem(30);
        }
    }
}

